<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><{:C('site_name')}></title>
<meta name="keywords" content="<{:C('keyword')}>" />
<meta name="description" content="<{:C('content')}>" />
<link rel="stylesheet" href="<{:STATICS}>/css/bootstrap.min.css" type="text/css" media="all" />
<link rel="stylesheet" type="text/css" href="<{:STATICS}>/centaurus/css/libs/font-awesome.css"/>
<link rel="stylesheet" href="<{:STATICS}>/css/jquery-ui.min.css" type="text/css" media="all" />
<link rel="stylesheet" href="<{:RES}>/css/style.css" type="text/css" media="all" />
</head>
<script type="text/javascript" src="<{:STATICS}>/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="<{:STATICS}>/js/bootstrap.min.js"></script>
<script type="text/javascript" src="<{:STATICS}>/js/jquery.artDialog.js?skin=aero"></script>
<script type="text/javascript" src="<{:STATICS}>/js/iframeTools.js"></script>
<script type="text/javascript" src="<{:STATICS}>/js/jquery.form.min.js"></script>
<script type="text/javascript" src="<{:STATICS}>/js/jquery.validate.min.js"></script>
<script type="text/javascript" src="<{:STATICS}>/js/jquery-ui.min.js"></script>
<script>
$(document).ready(function() {
	//ajaxform
	var options = { 
		beforeSubmit:showRequest,//表单验证方式
        success:showResponse  // post-submit callback 
    }; 

    $('#ajaxForm').ajaxForm(options); 
    var btnStr = $("#myBtn").html();
    function showResponse(responseText, statusText)  {
		if (statusText == 'success') {
			var responseText=eval('('+responseText+')');
			if(responseText.state == 'SUCCESS'){
				alert(responseText.message);
				closeIframe();
			}else{
				alert(responseText.state);
				$("#myBtn").removeAttr('disabled').html(btnStr);
			}			
		}else{
			$("#myBtn").removeAttr('disabled').html(btnStr);
		 	alert('Lost Service');	
		}
	} 

	function showRequest(){
		 validata = $("form.form-validata").valid();
		 if (validata){
		 	$("#myBtn").attr('disabled','disabled').html('<i class="fa fa-spinner fa-spin"></i> waiting...');
		 }
		 return validata;
	}

	//validation验证
	$("form.form-validata").validate({
		errorElement: "span",
        errorClass: "help-block error",
	})

});
</script> 

<script type="text/javascript">
var domid=art.dialog.data('domid');
// 返回数据到主页面
function closeIframe(url){
	var origin = artDialog.open.origin;
	origin.location.reload() ;
	setTimeout("art.dialog.close()", 100 )
}
</script>
<body>
<div class="container iframe">
	<div class="row">
		<div class="col-md-12">
			<form id="ajaxForm" action="<{:U('Mentees/comment')}>" method="post" class="form-validata">
				<div class="form-group">
					<label for="title">Star rating</label>
					<div class="star" id="star">
						<?php 
							if($comment){
								for($i=0;$i<$comment['star'];$i++){
									echo '<i class="fa fa-star"></i>';
								}
								for($i=5-$comment['star'];$i>0;$i--){
									echo '<i class="fa fa-star-o"></i>';
								}
							}else{
						?>
						<i class="fa fa-star"></i><i class="fa fa-star-o"></i><i class="fa fa-star-o"></i><i class="fa fa-star-o"></i><i class="fa fa-star-o"></i>
						<?php } ?>
					</div>
					<input id="starVal" name="star" type="hidden" value="1"/>
				</div>
				<div class="form-group">
					<label for="content"><{:L('_content')}></label>
					<textarea id="content" name="content" class="form-control" rows="5" required maxlength=500  placeholder="Please enter evaluation content"><{$comment['content']}></textarea>
				</div>
				<input name="toID" type="hidden" value="<{$list.userid}>"/>
				<input name="toName" type="hidden" value="<{$list.nickname}>"/>
				<input name="toFace" type="hidden" value="<{$list.face}>"/>
				<div class="form-group" style="text-align: right;"><button id="myBtn" type="submit" class="btn btn-primary"><{:L('_submit')}></button></div>
			</form>

		</div>
	</div>
</div>
</body>
</html>
<style type="text/css">
/*星级评价*/
#star i{margin-right: 5px; font-size: 20px;cursor: pointer;color: #f39c12;}
</style>
<script type="text/javascript">
var oStar = document.getElementById("star");
var aLi = oStar.getElementsByTagName("i");
var i = iScore = iStar = <?php if($comment['star']>0){echo $comment['star']; }else{echo 1;} ?>;
for (i = 1; i <= aLi.length; i++){
	aLi[i - 1].index = i;
	//鼠标移过显示分数
	aLi[i - 1].onmouseover = function (){
		fnPoint(this.index);
	}
	//鼠标离开后恢复上次评分
	aLi[i - 1].onmouseout = function (){
		fnPoint();
	};
	//点击后进行评分处理
	aLi[i - 1].onclick = function (){
		iStar = this.index;
		$("#starVal").val(iStar);
	}
}

//评分处理
function fnPoint(iArg){
	//分数赋值
	iScore = iArg || iStar;
	for (i = 0; i < aLi.length; i++){
		aLi[i].className = i < iScore ? "fa fa-star" : "fa fa-star-o";
	} 	
}
</script>
